<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="../js/bootstrap/css/bootstrap.min.css">
    <title>会员注册</title>
</head>
<body>
<div class="container">
    <div class="row">
        <div class="col-sm-12">
            <form class="form-horizontal">

                <div class="form-group">
                    <label class="col-sm-2 control-label">会员名:</label>
                    <div class="col-sm-4">
                        <input type="text" id="memberName" class="form-control"  placeholder="请输入会员名称">
                    </div>
                </div>

                <div class="form-group">
                    <label class="col-sm-2 control-label">会员昵称:</label>
                    <div class="col-sm-4">
                        <input type="text" id="nickName" class="form-control"  placeholder="请输入昵称">
                    </div>
                </div>

                <div class="form-group">
                    <label class="col-sm-2 control-label">会员密码:</label>
                    <div class="col-sm-4">
                        <input type="password" id="password" class="form-control" placeholder="请输入密码">
                    </div>
                </div>

                <div class="form-group">
                    <label class="col-sm-2 control-label">确认密码:</label>
                    <div class="col-sm-4">
                        <input type="password" id="confirmPassword" class="form-control" placeholder="请再次输入密码">
                    </div>
                </div>

                <div class="form-group">
                    <label class="col-sm-2 control-label">手机号:</label>
                    <div class="col-sm-4">
                        <div class="input-group">
                            <input type="text" class="form-control" id="phone" placeholder="请输入手机号">
                            <span class="input-group-btn">
                                <button class="btn btn-primary" onclick="sendCode()" type="button">发送验证码</button>
                            </span>
                        </div>
                    </div>
                </div>

                <div class="form-group">
                    <label class="col-sm-2 control-label">验证码:</label>
                    <div class="col-sm-4">
                        <input type="text" id="code" class="form-control" placeholder="请输入验证码">
                    </div>
                </div>

                <div class="form-group">
                    <label class="col-sm-2 control-label">邮箱:</label>
                    <div class="col-sm-4">
                        <input type="text" id="mail" class="form-control" placeholder="请输入邮箱">
                    </div>
                </div>

                <div class="form-group">
                    <div class="col-sm-offset-2 col-sm-10">
                        <button type="button" class="btn btn-primary" onclick="regMember();"><span class="glyphicon glyphicon-plus"></span>注册</button>
                        <button type="reset" class="btn btn-default"><i class="glyphicon glyphicon-refresh"></i>重置</button>
                        <a href="login.html">已有账号？点我登录</a>
                    </div>
                </div>
            </form>
        </div>
    </div>
</div>

<script src="../js/jquery-3.3.1.js"></script>
<script src="../js/bootstrap/js/bootstrap.min.js"></script>
<script src="../js/common.js"></script>
<script>
    function sendCode() {
        var v_phone = $("#phone").val();
        $.ajax({
            type:"post",
            url:API_URL+"sms",
            data:{"phone":v_phone},
            success:function (res){
                if (res.code == 200){
                    alert("发送验证码成功！");
                }else {
                    alert(res.msg);
                }
            }
        })
    }
    function regMember() {
        var v_param = {};
        v_param.memberName = $("#memberName").val();
        v_param.nickName = $("#nickName").val();
        v_param.password = $("#password").val();
        v_param.mail = $("#mail").val();
        v_param.phone = $("#phone").val();
        v_param.confirmPassword = $("#confirmPassword").val();
        v_param.phoneCode = $("#code").val();
        $.ajax({
            type:"post",
            url:API_URL+"member",
            data:JSON.stringify(v_param),
            contentType:"application/json",
            success:function (res){
                if (res.code == 200){
                    location.href="regSuccess.html";
                }else {
                    alert(res.msg);
                }
            }
        })
    }
</script>
</body>
</html>